<script setup lang="ts">
import {ref} from "vue";

const options = ref([
  {
    label: '测试1',
    key: '测试1',
    children: [
      {
        label: 'Two Of Us',
        key: 'Two Of Us'
      },
      {
        label: 'Dig A Pony',
        key: 'Dig A Pony'
      },
    ]
  },
  {
    label: '测试2',
    key: '测试2',
    children: [
      {
        label: 'Two Of Us2',
        key: 'Two Of Us2'
      },
      {
        label: 'Dig A Pony2',
        key: 'Dig A Pony2'
      },
    ]
  },
])

const selectedId = ref<string[]>([])

const changeVal = (v:string[]) => {
  console.log('changeVal:', v)
  selectedId.value = v
}
</script>

<template>
  <n-tree-select
      multiple
      checkable
      filterable
      :options="options"
      clearable
      style="width: 300px;"
      :value="selectedId"
      :on-update:value="changeVal"
  />
</template>
